<template>
	<view class="searchPag">
		<view class="searchHeader">
			<view class="backIndex" @click="goIndex()">
				<image src="../../static/img/back.png" mode=""></image>
			</view>
			<input v-model="searchcontent" class="search-input" type="text" placeholder="请输入关键字" />
			<view class="nav-search" @click="getHotelData(searchcontent)">搜索</view>
		</view>
		<navitation v-bind:jdData="jdData"></navitation>
	</view>
</template>

<script>
	import navitation from '../../components/invitation.vue'
	export default {
		data() {
				return {
					jdData:[],
					// 输入框的值
					searchcontent:"",
				}
		},
		components:{
			navitation
		},
		methods: {
			//点击返回键，返回上一页
			goIndex() {
				uni.switchTab({
					url: '../index/index'
				})
			},
			//获取酒店的信息
			getHotelData(searchcontent){
				let message = {};
				if(searchcontent){
					message = {'hname':searchcontent}
				}
				let that = this
				uni.request({
					// 根据id查询酒店信息
					url:'http://localhost:3030/searchJD',
					method:'post',
					data:message,
					success:(res)=>{
						console.log(res)
						let result = res.data.data
						this.jdData = result
						}
				})
			}
		}
	}
</script>

<style scoped>
//顶栏样式
.searchHeader {
	margin-top: 20rpx;
	text-align: center;
	width: 100%;
	height: 100rpx;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20rpx;
}
.backIndex image {
	margin-left: 5rpx;
	width: 50rpx ;
	height: 50rpx ;
}
.search-input {
	width: 70%;
	height: 60rpx;
	text-align: left;
	border: 2rpx solid #C0C0C0;
	border-radius: 30rpx;
	background-color: #F7F7F7;
}
.nav-search {
	margin-right: 20rpx;
	padding-top: 20rpx;
	font-size: 28rpx;
	height: 60rpx;
}
/* 搜索结果内容样式 */
.home-invitation{
	margin-top: 30rpx;
}

</style>
